page {
  width: 100vw;
  background-color: #f4f4f4;
}

.wrap {
  .top-bar {
    position: fixed;
    z-index: 1;
    top: 0;
    left: 0;
    right: 0;
    .title-nav {
      box-sizing: border-box;
      .btn-back-wrap{
        padding: 10rpx;
      }
      .back-icon {
        font-size: 44rpx;
        margin: 0 10rpx;
      }
    }
    .option-nav {
      padding: 10rpx 30rpx 0;
      height: 60rpx;
      .top-phone {
        height: 60rpx;
        line-height: 60rpx;
        padding: 0 34rpx;
        border-radius: 60rpx;
        .icon-shouji {
          margin-right: 14rpx;
        }
      }
    }

    .attention{
      padding: 12rpx 25rpx;
      background-color: #FFF5DF;
      .btn-attention{
        height: 60rpx;
        line-height: 60rpx;
        padding: 0 18rpx;
        border-radius: 10rpx;
        background-color: #FFC056;
      }

    }
  }

  .body {
    width: 100%;
    box-sizing: border-box;
    padding: 60rpx 20rpx 0;
    
  }

  .bottom-option {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 20rpx 25rpx;
    background: #ffffff;
    box-shadow: 0 0 10rpx 0 rgba(0, 0, 0, 0.1);

    .card-box{
      position: absolute;
      left: 0;
      right: 0;
      top: -350rpx;
    }

    .common-btn {
      border: 2rpx solid #cccccc;
      border-radius: 10rpx;
      height: 68rpx;
      line-height: 68rpx;
      padding: 0 20rpx;
      margin-right: 20rpx;
      background-color: white;
      &.ready {
        border-color: transparent;
        background-color: #0dca0f;
        color: white;
      }
    }

    .bottom-input {
      height: 68rpx;
      line-height: 68rpx;
      background: #ffffff;
      border: 2rpx solid #cccccc;
      border-radius: 10rpx;
      margin: 0 20rpx;
      padding: 0 20rpx;
    }

    .long-touch-btn {
      &.touched {
        background-color: #f4f4f4;
      }
    }
  }
}
